<template>
    <div>
        <div class="warp">
            <BreadCrumb></BreadCrumb>
        </div>
        <h1>不带头像的所有学生信息查询</h1>

        <div class="tables">
            <el-table id="work-table" :data="tableData" style="width:100%;overflow:auto;height: 450px;">

                <el-table-column prop="stu_id" label="学号">
                </el-table-column>
                <el-table-column prop="stu_name" label="姓名">
                </el-table-column>
                <el-table-column prop="stu_sex" label="性别">
                </el-table-column>
                <el-table-column prop="stu_jg" label="籍贯">
                </el-table-column>
                <!-- 时间格式设置-->
                <el-table-column prop="stu_date" label="出生日期">
                    <template slot-scope="scope">
                        <p>{{ $moment(scope.row.stu_date).format("YYYY-MM-DD") }}</p>
                    </template>
                </el-table-column>
                <el-table-column prop="stu_gbf" label="男或女朋友">
                </el-table-column>
                <el-table-column prop="stu_hobby" label="爱好">
                </el-table-column>
            </el-table>

           
            <div class="but">
                <el-button @click="exportExcel">将数据导出到本地Excel</el-button>
            </div>
        </div>
    </div>
</template>

<script>
import { req_stu_info_nohead } from "@/api/stuInfo";
import XLSX from "xlsx";
import FileSaver from "file-saver";
export default {
    data() {
        return {
            tableData: [],
           
        }
    },

    async mounted() {
        let result = await req_stu_info_nohead();
        console.log(result);
        this.tableData = result.data;
    },
    methods: {
        exportExcel() {
            // / 将table生成工作簿对象 参数一 table对象
            let wb = XLSX.utils.table_to_book(document.getElementById("work-table"), {
                raw: true,
            });
            // 根据工作簿当中的内容将其变为二进制 输出
            let wbout = XLSX.write(wb, {
                bookType: "xlsx",
                bookSST: true,
                type: "array"
            });

            // 将得到的二进制文件存储到Blob
            try {
                FileSaver.saveAs(
                    new Blob([wbout], { type: "application/octet-stream" }),
                    "stuInfo.xlsx"
                );
            } catch (e) {
                console.log(e);
            }
        }
    }
}
</script>

<style lang="scss" scoped>
.but {
    height: 30px;
}
</style>